<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
    <h1>{{ msg }}</h1>

    <!--插值表达式为了安全，会把数据先做实体转义，> &gt;  < &lt;-->
    <div>{{ htmlContent }}</div>

    <hr>
    <!--v-html底层：div.innerHTML = htmlContent-->
    <!--注意事项：v-html使用的标签内部如果事先有数据，会被覆盖-->
    <div v-html="htmlContent"></div>
    <!--v-html类似提供了一个 js执行语境，相当于是在 script环境下写代码-->
    <div v-html=" '展示的内容：' + htmlContent"></div>

</div>
</body>
<script src="lib/vue.js"></script>
<script type="text/javascript">
    new Vue({
        el: '#app',
        data: {
            msg: 'hi vuejs!',
            htmlContent: '<h2>我是h2标签</h2>',
        }
    })
</script>

</html>
